@import 'util.sass'

\:host
  padding: 0 30px
  background: $bg-body
  overflow: auto

.fui-search
  width: 350px
  margin-right: 16px

.color
  display: flex
  align-content: center
  height: 32px
  margin-bottom: 16px
  font-family: Consolas, Monaco, monospace

  &-search
    display: flex
    align-content: center

  &-content
    min-width: 350px
    margin-right: 16px

  &-name
    display: flex
    align-items: center
    line-height: 24px

    .fui-icon
      visibility: hidden
      margin-left: 8px
      cursor: pointer

      &:hover
        fill: var(--fui-primary-color-normal)

    &:hover .fui-icon
      visibility: visible

  &-note
    line-height: 16px
    font-size: 12px
    color: var(--fui-text-color-assist)

  &-palette
    height: 32px
    width: 120px
    margin-right: 16px

  &-value
    line-height: 32px
